<template>
  <div id="box">
    <van-nav-bar
            title="我的委托"
            left-text=""
            left-arrow
            @click-left="onClickLeft"
            :border="false"    
    />
    <main>
        <div class="bao">
        <div class="cla">
        <img src="https://img1.baidu.com/it/u=1877228791,516138660&fm=253&fmt=auto&app=120&f=JPEG?w=650&h=650" alt="">
        </div>
        <div class="desc">
          <p>案件类型：家庭婚姻</p>
          <p>案件标题：当事人无法预估</p>
          <p>案件进度：填写中</p>
          <p>发布时间：2022.07.08 11.00</p>
        </div>
        <div class="btn">
          <button @click="goManlawyer">查看详情</button>
        </div>
        </div>
    </main>
    </div>
</template>

<script>
import { Toast } from 'vant';
import Manlawyer from './Weituoj/Manlawyer.vue';
export default {
    comments:{
      Manlawyer,
    },
    methods:{
      goJie(){
        console.log(this.$router);
      },
      onClickLeft() {
        this.$router.go(-1);
    },
     onEdit() {
      Toast('编辑');
    },
     goManlawyer(){
         this.$router.push('/Manlawyer')
      }
    },
   
}
</script>

<style scoped>
/* scoped 让样式只在当前组件生效  ！important(父子元素存在同样类名时用)*/
.box{
   background: orange;
}
p{
  font-size: 0.24rem;
  color: #6c6c6c;
}
img{
  width: 1.74rem;
  height: 1.74rem;
}
main{
  width:7.5rem;
  height:12.92rem;
  background-color: #f2f2f2;
  border-top:2px solid #9A9A9A;
  display: flex;
  justify-content: center;
}
.bao{
  width: 7rem;
  height: 2.2rem;
  background-color: #ffffff;
  display: flex;
  justify-content:space-around;
  align-items: center;
  border-radius: 0.02rem;
  
}
.btn{
  width: 1.38rem;
  height: 0.44rem;
  font-size: 0.22rem;
}

</style>